{template 'common/header'}
<style>
    a,a:active,a:visited,a:hover{text-decoration:none}
    .mui-card{
        margin-top: 20px;
    }

    .mui-card-media{background-color: #fff;}
    .mui-card-content{padding: 20px;}
    .mui-card-media .title{font-size: 22px;line-height: 200%;}
    .avatar{width: 50px;  height: 50px;  margin-right: 10px}
    .avatar img{border-radius: 50%;  width:100%;}
    .mui-card .pic img{ text-align: center; width: 30%;}
    .user_avatar{color: #00a5e0;font-size: 16px;}
    .mui-ellipsis{color: #999; font-size: 12px;margin-top: 5px;}
    .mui-card-footer{text-align: right;}
    .title{ font-size: 18px; line-height: 180%;}
    .mui-card-header{position: relative;}
    .mui-card-header .hits {
        position: absolute;
        right: 60px;
        top: 30px;
        color: #999;
    }
    a.mui-card-link{
        color: #d70010;
    }
    .mui-btn-blue, .mui-btn-primary, input[type=submit]{
        background-color: #d70010;
        color: #ffffff;
        border: 1px solid #d70010;
    }
    .mui-card-header.mui-card-media.pic img{
        width:100%;
        margin-bottom:5px;
    }
</style>
<div class="mui-card">

    <div class="mui-card-header mui-card-media" style="background-color: #f7f7f7;">
        <div class="mui-card-media-object mui-pull-left avatar">
            <img src="{php echo $this->getavatar($data['openid'])}" alt="">
        </div>
        <div class="mui-card-media-body user_avatar">
            {php echo $this->getnickname($data['openid'])}
            <p class="mui-ellipsis">{php echo $this->from_time($data['createtime'])} </p>
        </div>
        <div class="hits">浏览：{php echo $data['hits']+1}</div>

    </div>

    {if $data['pic'] != ''}
    <!--<div class="mui-card-header mui-card-media pic" >-->
        <!--<img src="../attachment/{php echo $data['pic']}" alt="">-->
    <!--</div>-->
    {/if}
    <div class="mui-card-content mui-card-media" style="">
        <div class="title" >
            {php echo $data['title']}
        </div>
        {php echo $data['content']}
    </div>
    {if $data['pics'] != ''}
    <div class="mui-card-header mui-card-media pic" >
        {loop $picsarr $row}
        <a href="{php echo(tomedia($row));}"><img src="{php echo(tomedia($row));}" alt=""></a>
        {/loop}
    </div>
    {/if}
    <div class="mui-card-footer">
        <a class="mui-card-link zan">{if $data['iszan'] ==1}已赞{else}赞{/if}（{php echo $data['zan']}）</a>
        <a class="mui-card-link fav">{if $data['isfav'] ==1}已收藏{else}收藏{/if}</a>
    </div>
</div>

<!--回复列表 -->

{loop $hfdata $row}
<div class="mui-card">
    <div class="mui-card-header mui-card-media" style="background-color: #f7f7f7;">
        <div class="mui-card-media-object mui-pull-left avatar">
            <img src="{$row['avatar']}" alt="">
        </div>
        <div class="mui-card-media-body user_avatar">
            {$row['nickname']}
            <p class="mui-ellipsis">{$row['createtime']} </p>
        </div>
    </div>
    <div class="mui-card-content mui-card-media" style="">
        {$row['content']}
    </div>
</div>
{/loop}
<!--发表回复-->
<div class="mui-card">
    <div class="mui-card-header mui-card-media" style="background-color: #f7f7f7;">
        回复帖子：
    </div>
    <div class="mui-card-content mui-card-media" style="">
        <div class="mui-input-row" style="margin: 10px 5px;">
            <textarea id="content" rows="5" placeholder="请输入回复内容"></textarea>
        </div>
    </div>
    <div class="mui-card-footer">
        <input type="hidden" id="pid" value="{php echo $data['id']}">
        <input class="huifu" type="submit" value="立即回复" type=submit">
    </div>
</div>
<div style="height: 20px;"></div>
<script>
$(function () {
    var pid = $('#pid').val();
    $('.huifu').click(function(){
        var data = {
            act:'savehf',
            pid : pid,
            content : $('#content').val(),
        }
        console.log(data);
        $.ajax({
            type : "post",
            data: data,
            dataType:'json',
            url : "{php echo $this->createMobileUrl('detail')}&id="+pid+"&op=ajax",
            success : function(data) {
                if(data.status == 1){
                    mui.toast(data.msg);
                    setTimeout(function(){
                        location.href="{php echo $this->createMobileUrl('detail')}&id="+pid;
                    },1500)
                }
            }
        })
    })
    $('.zan').click(function(){

        $.ajax({
            type : "post",
            dataType:'json',
            url : "{php echo $this->createMobileUrl('detail')}&id="+{$data['id']}+"&op=zan",
            success : function(data) {
                if(data.status == 1){
                    $('.zan').html(data.msg+'（'+data.count+'）');
                }
            }
        })
    })
    $('.fav').click(function(){

        $.ajax({
            type : "post",
            dataType:'json',
            url : "{php echo $this->createMobileUrl('detail')}&id="+{$data['id']}+"&op=fav",
            success : function(data) {
                if(data.status == 1){
                    $('.fav').html(data.msg);
                }
            }
        })
    })
})
</script>